Alpha Shell
Description
Alpha Shell is a mobile iOS and Android application for testing UX components on a mobile device.
Overview
Alpha Shell is a free app available in the Google Play and iOS App Stores for testing components on a mobile device. Alpha Shell is for Alpha Anywhere developers who are developing mobile applications to quickly test a UX component in a mobile environment. Alpha Shell includes a variety of Cordova Plugins that can be used by developers in their components.
Using Alpha Shell, developers can quickly test UX components on a mobile device, such as an iPhone or Android smart phone. Alpha Shell can also be used to demo part or all of an application to a client. Components are downloaded and run from within Alpha Shell. No third party software is required to publish apps from Alpha Anywhere to Alpha Shell.
Limitations
Alpha Shell comes with a few caveats and limitations:
- UX Components must be published to a server, such as Alpha Cloud, before they can be installed in Alpha Shell. This server can be the development server but only if the device running Alpha Shell and your development machine are on the same network. Publishing to the development server is not available in Community Edition.
- Alpha Shell does not support custom web themes. UX components will be rendered in Alpha Shell using the out-of-the-box Alpha Theme.
- No custom plugins. While you can use Cordova Plugins included in Alpha Shell, you are also limited to the Cordova plugins shipped with Alpha Shell. If your component includes functionality that uses plugins not included in Alpha Shell, you cannot test that functionality in Alpha Shell.
- No offline support. Alpha Shell downloads and runs components from the application server on-demand. This means you must have a network connection in order to run your components in Alpha Shell.
Installing Alpha Shell
Alpha Shell can be installed on an iOS device from the App Store or on Android from Google Play. You can search the app store for your device for "Alpha Shell" or scan the QR Code below using your mobile device.
Alpha Shell Checklist
To test a UX component in Alpha Shell, the following needs to be done:
- Build your UX component
- Publish the UX component to the Application Server
- Generate a QR Code
- Add the server hosting the UX component to Alpha Shell
- Add the UX component to Alpha Shell
Generating an Alpha Shell QR Code for your Component
Components and the server that hosts them are added to Alpha Launch by scanning a QR Code. You can generate a QR Code for a UX component to add it to Alpha Launch using the Alpha Shell QR Codes... option for the Menu button on the UX Builder toolbar.
The Alpha Shell dialog can be used to generate a QR Code for the component, the server where the component has been published, or both the component and the server. Select Generate a QR Code for the Component name AND Server URL to create a QR Code to add the server and component to Alpha Shell. The server only needs to be added once. After the server has been added, you only need to generate a QR Code for the component to test other components published to the same server.
If you don't know your server URL, you can publish an .a5w page to the server with your component. Open the .a5w page in a browser. Copy the URL. The portion of the URL before your .a5w page name is the Server URL.
Adding Your Application Server to Alpha Shell
To add your server to Alpha Shell, launch Alpha Shell. Then tap the hamburger menu icon in the lower left-hand corner.
Select Settings from menu.
Tap the hamburger menu in the lower left-hand corner again to open the server settings menu. Then tap Add Server address.
Tap Scan in the upper right hand corner and scan your QR Code to add the server. Then tap OK to save your server.
Select your server in the Select server address to use section and tap Test Ajax Callback to verify that your server can be reached. A message indicating the server address is valid will be shown. If you get an error message, return to Alpha Anywhere and recreate the QR Code. Verify your server URL is correct and that the application server is running.
Tap Back to return to the Alpha Shell home screen.
Adding a Component to Alpha Shell
On the main screen, tap the hamburger menu icon in the lower left-hand corner. Then tap Add component.
Tap Scan in the upper right hand corner and scan your QR Code to add the component. Then tap OK to save your component.
The component will appear in the list on the main screen. Select the component from the list.
Alpha Shell will launch the component on a new screen.
When you are done testing the component, use the three dots button, located in the bottom right-hand corner, to return to the Alpha Shell home screen.
Creating your own Alpha Shell
The Alpha Shell app available in the Android and iOS app stores is based on the PhoneGap Shell V3 UX Template. If you wish to create your own Alpha Shell, you can use the PhoneGap Shell V3 template to create an app similar to Alpha Shell. You will need to publish your shell app to the app stores separately, which requires additional third party tools and accounts.
To create a UX component using the PhoneGap Shell - V3 template:
Create a new UX Component from the Web Projects Control Panel
In the Select UX Component Template dialog, click Create UX Component from a template. Then, select PhoneGap-Shell-V3 from the list of templates.
Select UX Component Template dialog with PhoneGap-Shell-V3 selectedClick OK to create the UX.
Videos
Webinar: Testing Components on a Mobile Device with Alpha Shell
In this webinar, we show how to test components on a mobile device using Alpha Shell.
Download Resources from GitHub
Using the PhoneGap Shell - V3 Component
The PhoneGap Shell - V3 component makes it easy to test PhoneGap/Cordova mobile apps on a real mobile device without having to go through the build process to turn your component into a Cordova application.